<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">
    <f:view contentType="text/html">
            <h:head>
                        <title>Login Ensambla-Car</title>
        <link rel="stylesheet" type="text/css" href="css/demo.css" />
        <link rel="stylesheet" type="text/css" href="css/style.css" />
        <link rel="stylesheet" type="text/css" href="css/animate-custom.css" />

            <f:facet name="first">
                <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
                <title>Ensambla car</title>
            </f:facet>
        </h:head>
    <h:body>
        <div class="container">
            <!-- Codrops top bar -->
            <div class="codrops-top">
                <div class="clr"></div>

                <div id="container_demo" >
                    <div id="wrapper">
                        <div id="login" class="animate form">
                            <h:form id="formLogin">
                                <br/>
                                <h1>Ensambla-Car</h1>
                                <p>
                                    <label for="username" > Correo</label>
                                    <p:inputText widgetVar="username" id="username" 
                                                 value="#{loginMB.nombreUsuario}" required="true"
                                    requiredMessage="Ingrese su nombre de usuario."/>
                                    <p:watermark for="username" value="nombreUsuario" />
                                    <p:message for="username" />
                                </p>
                                <p>
                                    <label for="password" >Password </label>
                                    <p:password widgetVar="password" id="password" 
                                                value="#{loginMB.password}" required="true"
                                                requiredMessage="Ingrese su password."/>
                                    <p:watermark for="password" value="password" />
                                    <p:message for="password" />
                                </p>
                                <p:messages id="messages" showDetail="true" autoUpdate="true"/>

                                <p class="login button">
                                    <h:commandButton value="Login"
                                    action="#{loginMB.autenticarUsuario}"></h:commandButton>
                                </p>
                            </h:form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </h:body>
</f:view>
</html>
